<!--
+----------------------------------------------------------------------
| 友得云客  - 开启房产营销新纪元
+----------------------------------------------------------------------
| Copyright (c) 2019~2023 优得（西安）信息科技有限公司版权所有
+----------------------------------------------------------------------
| Licensed 友得云客不是自由软件 未经允许不可移除相关版权
+----------------------------------------------------------------------
| Author: www.youdeyunke.com
+----------------------------------------------------------------------
-->
<template>
    <div v-loading="loading">
      <el-form v-loading="loading" label-position="right" label-width="150px" >
        <el-form-item label="后台安全水印">
            <el-switch v-model="watermark" @change="submitWatermarkHandle" />
            <info-tip tipText="在管理后台所有页面显示带有成员姓名和ID的安全水印,防止管理后台信息泄露" />
        </el-form-item>

        <el-form-item label="LPR基准利率">
            <el-input style="width: 300px" v-model="lpr_rate" placeholder="如：4.65"></el-input>
            <info-tip tipText="请输入央行最新公布的LPR基准利率，无需输入百分号，保留两位小数，如：4.65" />
        </el-form-item>

        <el-form-item label="允许上传文件类型">
            <el-select v-model="uploadAllowedExtensionOptions" @change="addItemToOptions(uploadAllowedExtensionOptions)"
                filterable allow-create multiple collapse-tags default-first-option style="width: 300px"
                placeholder="请选择">
                <el-option v-for="(item ,i ) in fixedOptions" :key="i" :label="item" :value="item">
                </el-option>
            </el-select>
        </el-form-item>

        <el-form-item label="小程序版本号">
            <el-input style="width: 300px" v-model="xcx_version" placeholder=""></el-input>
        </el-form-item>

        <el-form-item>
            <el-button type="primary" size="small" :disabled="loading" :loading="loading" @click="superConfig"
                icon="el-icon-check">保存设置</el-button>
        </el-form-item>
      </el-form>
    </div>
</template>

<script>
import { updateServerInfo } from "@/api/myconfig";
export default {
    name: 'sysinfo',
    props: {
        config: { type: Object, default: null },
    },
    watch: {
        config: {
            deep: true,
            handler(val, oldVal) {

                this.watermark = val.watermark;
                this.lpr_rate = val.lpr_rate;
                this.xcx_version = val.xcx_version;
                this.upload_allowed_extension = val.upload_allowed_extension;
                this.fixedOptions = val.upload_allowed_extension.split(",");
            }
        }
    },
    computed: {
        uploadAllowedExtensionOptions: {
            get() {
                if (!this.upload_allowed_extension) {
                    return []
                }
                const initialExtensions = this.upload_allowed_extension.split(',').filter(extension => extension !== '')
                // 过滤掉空字符串
                return initialExtensions
            },
            set(newValue) {
                // 当newValue发生变化时，更新config.upload_allowed_extension属性
                this.upload_allowed_extension = newValue.join(',')
            },
        },
    },
    data() {
        return {
            watermark: false,
            lpr_rate: '',
            xcx_version: '',
            upload_allowed_extension: '',
            fixedOptions: [],
            loading: false,
        }
    },

    methods: {

        addItemToOptions(val) {
            console.log(val)
            // //监听val为空数组时，清空options
            // if (val.length==1 && val[1] == ''){
            //   this.uploadAllowedExtensionOptions = []
            // }
            val.forEach((item) => {
                if (!this.fixedOptions.includes(item)) {
                    this.fixedOptions.push(item)
                }
            })
        },

        submitWatermarkHandle: function (keys) {
            this.loading = true;
            var data = JSON.parse(JSON.stringify(this.config));
            data.watermark = this.watermark;
            updateServerInfo(data).then((resp) => {
                this.loading = false
                if (resp.code != 0) {
                    return
                }
                this.$emit("updateConfig")
                this.$message.success("保存成功")
            })
        },

        superConfig: function () {

            this.loading = true;
            updateServerInfo({
                watermark: this.watermark,
                lpr_rate: this.lpr_rate,
                xcx_version: this.xcx_version,
                upload_allowed_extension: this.upload_allowed_extension,
            }).then((resp) => {
                this.loading = false;
                if (resp.code != 0) {
                    return
                }
                this.$emit("updateConfig")
                this.$message.success("保存成功")
            })
        },

    },

}
</script>

<style></style>
